﻿html,
body {
  margin: 0;
  padding: 0;
  width: 100%;
  height: 100%;
  line-height: 1;
  font-family: "Microsoft Yahei, SimHei, tahoma, arial, Hiragino Sans GB, SimSun, sans-serif";
  font-weight: 400;
}

p {
  margin: 0;
  padding: 0;
}

body > img {
  display: block;
  position: absolute;
  z-index: -99;
  width: 7.5rem;
  left: 50%;
  -webkit-transform: translateX(-50%);
  -moz-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  transform: translateX(-50%);
}

main {
  width: 7.5rem;
  height: 100%;
  text-align: center;
  margin: 0 auto;
}

main > .face-box {
  display: block;
  width: 1.44rem;
  height: 1.46rem;
  margin: 0 auto;
  -moz-box-sizing: content-box;
  box-sizing: content-box;
  padding: 0.6rem 0 0;
}

.face-box img {
  border-radius: 0.15rem;
  display: block;
  width: 100%;
  height: 100%;
}

main > .face-box + p {
  font-size: 0.29rem;
  margin: 0.1rem 0 0;
  color: #fff;
}

.invite-id {
  margin: 0.26rem auto 0;
  width: 88.67%;
  height: 1.79rem;
  line-height: 1.79rem;
  font-size: 0.56rem;
  color: #fff;
  background: url("/image/title-bg.png") no-repeat center/100% 100%;
}

.invite-id span,
.room-num span {
  font-size: 0.56rem;
  color: #c5ff71;
}

.invite-details {
  width: 68%;
  margin: 0 auto;
  font-size: 0.33rem;
  line-height: 1.5;
  color: #fff;
  text-align: left;
  padding-top: 0.46rem;
}

.invite-details p {
  text-align: center;
}

.invite-details p img {
  display: inline-block;
  vertical-align: bottom;
  width: 0.56rem;
  height: 0.44rem;
}

.game-name {
  font-size: 0.37rem;
  line-height: 1.5;
  color: #c5ff71;
  display: inline;
}

.ui-invite-btn,
.ui-enter-btn {
  display: block;
  margin: 0.65rem auto 0;
  width: 3.76rem;
  height: 1.43rem;
  background: url("/image/recieve.png") no-repeat center/100% 100%;
}

.ui-enter-btn {
  background: url("/image/enter.png") no-repeat center/100% 100%;
}

.recieve-num {
  color: #76fdff;
}

.game-name-box {
  color: #fff;
  font-size: 0.44rem;
  margin: 0 auto;
  text-align: center;
  padding: 0.86rem 0 0.5rem 0;
}

.game-name-box img {
  display: inline-block;
  vertical-align: middle;
  width: 3.24rem;
  height: 0.77rem;
  margin-right: 0.3rem;
}

.room-num {
  margin: 0.55rem auto 0;
  width: 88.67%;
  height: 1.79rem;
  line-height: 1.79rem;
  font-size: 0.56rem;
  color: #fff;
  background: url("/image/title-bg.png") no-repeat center/100% 100%;
}

.invite-tips {
  color: #fff;
  font-size: 0.24rem;
  width: 5.76rem;
  text-align: center;
  margin: 0.8rem auto 0.5rem;
}

.invite-tips span {
  display: inline-block;
  color: cornflowerblue;
  font-weight: bold;
  padding: 0 4px;
}

.about-game {
  font-size: 0.24rem;
  color: #fff;
  width: 69.3%;
  margin: 0.8rem auto 0;
  height: 2.62rem;
  overflow-y: scroll;
  line-height: 1.5;
  text-align: left;
  text-indent: 0.48rem;
}

.fn-hide {
  display: none;
}
